<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<!--
 *
 * Windows 7 UI & Windows Aero for Websites - jQuery Plugin (v2.5)
 * Copyright 2010, Christian Goldbach
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * Can be used in GPL applications / NOT for Commercial use / Licensing information: info@soyos.net
 * 
 * Project Website:
 * http://www.soyos.net/Windows_7_UI_and_Windows_Aero_for_Websites.html
 *
 *
 * SOYOS Online Solutions
 * http://www.soyos.net
 *
 * SOYOS Labs
 * http://www.soyos.net/labs.html
 *
 * SOYOS Help & Support
 * http://www.soyos.net/community/
 *
 * SOYOS on Facebook
 * http://facebook.com/soyos.net
 *
 *
 * Requires Easing Plugin for Window Animations:
 * jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
 *
 * Date: 2011-01-10
 *
//-->
  <head>
    <title>Home Page</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <link href="css/jquery-ui-1.8.6.custom.css" rel="stylesheet" type="text/css"/>
    <link href="css/AeroWindow.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> 
    <script type="text/javascript" src="js/jquery-ui-1.8.1.custom.min.js"></script> 
    <script type="text/javascript" src="js/jquery.easing.1.3.js"></script>        
    <script type="text/javascript" src="js/jquery-AeroWindow.min.js"></script>
    <script type="text/javascript" src="js/jquery.sidecontent3.0.2.js"></script>

    <style>
      * {
        margin: 0px;
        padding: 0px;
      }
      body {
		background: url(wm-logo.jpg);
		background-repeat:no-repeat;
		background-position:50% 0%;
		

        font-family: arial;
        overflow: hidden;
   	    background-color:#009fe3;

      }
      #link {
        position: absolute;
        bottom: 60px;
        right: 30px;
        color: white;
        font-size: 11px;
      }
      #link a:link, #link a:visited {
        color: white;
      }
    
	
	/* Optional styles  side content started */
                .sidecontentpullout {
                        background-color: Black;
                        color: White;
                        padding: 4px 3px;
                        -moz-border-radius-bottomleft: 1em;
                        -moz-border-radius-topleft: 1em;
                        -webkit-border-bottom-left-radius: 1em;
                        -webkit-border-top-left-radius: 1em;
                        border-bottom-left-radius: 1em;
                        border-top-left-radius: 1em;
                }
                
                .sidecontentpullout:hover {
                        background-color: #444444;
                        color: White;
                }
                
                .sidecontent {
                        background-color: Black;
                        color: White;
                        -moz-border-radius-bottomleft: 1em;
                        -webkit-border-bottom-left-radius: 1em;
                        border-bottom-left-radius: 1em;
                }
                
                .sidecontent > div > div {
                        padding-left: 10px;
                        padding-right: 60px;
                }  
	/* Optional styles  side content ended */
	
    </style>
    
    
  </head>
  <body>
    <img src="images/guide/guide-icons.png" style="position: absolute; left: 0px; top: 170px;">
    <img src="images/guide/guide-menu.png" style="position: absolute; left: 10px; bottom: 40px;">


    <!-- HTML Content Container for Windows Starts-->
    <div id="DesktopIcons">
      <ul style="display: none">
        <li><a href="content.html"><img src="images/icons/services.png" border="0">Service Offered</a>        
        <li><a href="content.html"><img src="images/icons/tandc.png" border="0">Terms and Conditions</a>        
        <li><a href="content.html"><img src="images/icons/contactus.png" border="0">Contact Us</a>        
      </ul>  
    </div>        
    <!-- HTML Content Container for Windows Endss-->
    
		<!-- Side Content Tabs Starts -->
        <div class="side" title="Who?">
            <h2>What is WiFi Me?</h2>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi non nulla eget dolor feugiat lacinia vitae sed tortor. Phasellus dictum euismod vehicula. In lectus eros, adipiscing at tincidunt tempor, posuere non risus. Quisque eleifend purus at quam condimentum ornare. Sed sollicitudin, urna in ultrices tincidunt, purus ante accumsan erat, id rhoncus nunc massa fringilla sapien. Nullam cursus euismod orci, nec mattis elit aliquet sit amet. Duis vel dignissim metus. Praesent vitae lacus ante. Proin vitae risus lectus, quis blandit tortor. Quisque arcu lacus, vulputate et posuere ac, consectetur at purus. Nulla a molestie urna. Etiam et odio at felis placerat adipiscing quis vitae lacus. Nam tempus enim quis libero sodales nec tristique justo rhoncus. Praesent tincidunt scelerisque venenatis.</p>
        <p>Aliquam erat volutpat. Etiam quam lectus, hendrerit porttitor cursus gravida, imperdiet in arcu. Proin eleifend tortor at tortor bibendum ac fermentum mauris aliquet. Nullam ut bibendum diam. Fusce vel eros dolor. Morbi elementum diam eu lectus auctor tincidunt. Donec blandit nunc quis dui viverra lobortis. Vestibulum commodo velit non turpis dignissim quis egestas tortor fringilla. Pellentesque sagittis, dui quis sollicitudin pretium, magna lectus tristique risus, a eleifend nibh metus vehicula mi. Donec a sapien est.</p>
        <p>Phasellus suscipit urna non justo vestibulum tristique. Suspendisse commodo dolor sit amet mauris placerat molestie. Proin ullamcorper, quam quis euismod tincidunt, sem tortor rhoncus dui, nec elementum est sem vel justo. Donec accumsan scelerisque ultrices. Vestibulum tincidunt lorem vitae odio consequat mollis. Vestibulum ultricies pretium ornare. Duis id ligula mauris, sed ultricies libero. Nullam tristique commodo pellentesque. Pellentesque id odio sit amet sem porta vestibulum. Duis bibendum, ante a congue tempus, lectus lacus luctus augue, eget gravida nunc velit vitae felis. Vestibulum at lacus lectus, in dictum sem. Suspendisse mollis gravida libero eget hendrerit. Donec risus erat, pulvinar auctor ullamcorper id, tristique ut leo. Praesent et vestibulum est. In hac habitasse platea dictumst. Nulla facilisi. Fusce varius enim ac turpis rhoncus sagittis. Praesent tristique nibh eget justo commodo ornare. Quisque ac nunc ut ante venenatis eleifend. Ut lobortis convallis lobortis. </p>
        </div>
        <div class="side" title="Service">
            <h2>More Content</h2>
            <p>This is a different panel</p>
            <p>This is the side content that you want to de-clutter from your page.</p>
            <p>You can apply whatever CSS rules you like to this element, only the position and behaviour will be changed by the plugin.</p>

            <p>There are plenty of configurable settings if you want to change the default behaviour!</p>
        </div>
		<!-- Side Content Tabs Ends -->
	
	<!-- Start Menu -->    
    <script type="text/javascript">
    var ShowTaskbar = true;
    $(document).ready(function() {
      //Initialize Desktop Icons ----------------------------------------------
      var desktop = $("body #DesktopIcons");
      var desktop_icons = $("a", desktop);
      $("ul", desktop).css("display", "none");

      desktop_icons.each(function(index) {
        if ($(this).attr('href') !== undefined)
          $(this).AeroWindowLink();
      });
      desktop_icons.remove();
    });
    </script>  

	<!-- Side Content -->
	<script type="text/javascript">
		$(".side").sidecontent();
	</script> 
    <img src="images/guide/guide-tabs.png" align="right">     
  </body>  
</html>